<template>
	<div>
		<!-- 年度开工率 -->
		<Echart id="dialogChart2" :options="options" height="280px" width="100%" />
	</div>
</template>

<script>
	import Echart from '@/common/echart'
	export default {
		components: {
			Echart,
		},
		props: {
			cdata: {
				type: Object,
				default: () => ({})
			},
		},
		data() {
			return {
				options: {},
			};
		},
		watch: {
			cdata: {
				handler(newData) {
					this.options = {
						title: {
							text: '训练误差图'
						},
						tooltip: {
							trigger: "axis",
							backgroundColor: "rgba(255,255,255,0.1)",
							axisPointer: {
								type: "shadow",
								label: {
									show: true,
									backgroundColor: "#7B7DDC"
								}
							}
						},
						// legend: {
						// 	data: ["东进水流量", "西进水流量", "出水流量", "东组二沉池SS", "西组二沉池SS", "气浮池SS"],
						// 	textStyle: {
						// 		color: "#B4B4B4"
						// 	},
						// 	top: "0%"
						// },
						grid: {
							x: "8%",
							width: "88%",
							y: "15%"
						},
						xAxis: {
							data: newData.category,
							axisLine: {
								lineStyle: {
									color: "#B4B4B4"
								}
							},
							axisTick: {
								show: false
							}
						},
						yAxis: [{
							splitLine: {
								show: false
							},
							axisLine: {
								lineStyle: {
									color: "#B4B4B4"
								}
							},

							axisLabel: {
								formatter: "{value} "
							}
						}],
						series: [{
								name: "东进水流量",
								type: "line",
								smooth: true,
								showAllSymbol: true,
								symbol: "emptyCircle",
								symbolSize: 8,
								yAxisIndex: 0,

								data: newData.lineData4
							},
						]
					}
				},
				immediate: true,
				deep: true
			},
		},
	}
</script>